[#import "/base/spring.ftl" as spring /]
<!DOCTYPE html>
<html lang="en">
  <head>
    [#include "/base/base.ftl"/]
    <link rel="stylesheet" type="text/css" href="${base}/assets/bootstrap-fileupload/bootstrap-fileupload.css" />
  </head>

  <body>

  <section id="container" class="">
      <!--header start-->
      [#include "/base/header.ftl"/]
      <!--header end-->
      <!--sidebar start-->
       [#include "/base/left.ftl"/]
      <!--sidebar end-->
      <!--main content start-->
      <section id="main-content">
          <section class="wrapper">
              <!-- page start-->
              <div class="row">
                  <div class="col-lg-12">
                      <section class="panel">
                          [#include "/base/crumbs.ftl"/]
                          <div class="panel-body">
                              <form class="form-horizontal tasi-form" method="post" enctype="multipart/form-data">
                              
                               <div class="form-group">
                                      <label class="col-sm-2 col-sm-2 control-label">机构LOGO</label>
                              	 <div class="col-md-9">
                                              <div class="fileupload fileupload-new" data-provides="fileupload"><input type="hidden">
                                                  <div class="fileupload-new thumbnail" style="width: 200px; height: 150px;">
                                                  	[#if cooperationInfo.logo_url ??]
                                                  		<img src="${cooperationInfo.logo_url}" alt="">
                                                  	  [#else]
                                                  	   <img src="http://www.placehold.it/200x150/EFEFEF/AAAAAA&amp;text=no+image" alt="">
                                                  	[/#if]
                                                  </div>
                                                  <div class="fileupload-preview fileupload-exists thumbnail" style="max-width: 200px; max-height: 150px; line-height: 10px;"></div>
                                                  <div>
                                                   <span class="btn btn-white btn-file">
                                                   <span class="fileupload-new"><i class="icon-paper-clip"></i> 选择图片</span>
                                                   <span class="fileupload-exists"><i class="icon-undo"></i> 更改</span>
                                                   <input type="file" class="default" name="multipartFile">
                                                   </span>
                                                      <a href="#" class="btn btn-danger fileupload-exists" data-dismiss="fileupload"><i class="icon-trash"></i> 移除</a>
                                                  </div>
                                              </div>
                                              <span class="label label-danger">NOTE!</span>
                                             <span>
                                            		 请不要上传超过10MB的图片文件
                                             </span>
                                       </div>
                              		</div>
                              
                                  <div class="form-group">
                                      <label class="col-sm-2 col-sm-2 control-label">机构名称</label>
                                      <div class="col-sm-4">
                                      [@spring.formInput "cooperationInfo.name",'class="form-control"'/]
                                      </div>
                                       <div class="col-sm-4 messageTip">
                                   		    <span>机构名称100个字符以内</span>
                                            [@spring.showErrors /]
                                      </div>
                                  </div>
                                  <div class="form-group">
                                      <label class="col-sm-2 col-sm-2 control-label">链接地址</label>
                                      <div class="col-sm-4">
                                      [@spring.formInput "cooperationInfo.link",'class="form-control"'/]
                                      </div>
                                       <div class="col-sm-4 messageTip">
                                   		    <span>链接地址不要超过500个字符</span>
                                            [@spring.showErrors /]
                                      </div>
                                  </div>
                                   <div class="form-group">
                                      <div class="col-lg-offset-2 col-lg-10">
                                          <button class="btn btn-danger" type="submit">Submit</button>
                                      </div>
                                  </div>
                                  
                              </form>
                          </div>
                      </section>
                  </div>
              </div>
              <!-- page end-->
          </section>
      </section>
      <!--main content end-->
      <!--footer start-->
      [#include "/base/footer.ftl"/]
      <!--footer end-->
  </section>

    <!-- js placed at the end of the document so the pages load faster -->
    <script src="${base}/js/jquery.js"></script>
    <script src="${base}/js/bootstrap.min.js"></script>
    <script src="${base}/js/jquery.scrollTo.min.js"></script>
    <script src="${base}/js/jquery.nicescroll.js" type="text/javascript"></script>

    <script src="${base}/js/jquery-ui-1.9.2.custom.min.js"></script>
    <script class="include" type="text/javascript" src="${base}/js/jquery.dcjqaccordion.2.7.js"></script>
	<script type="text/javascript" src="${base}/assets/bootstrap-fileupload/bootstrap-fileupload.js"></script>

  <!--custom switch-->
  <script src="${base}/js/bootstrap-switch.js"></script>
  <!--custom tagsinput-->
  <script src="${base}/js/jquery.tagsinput.js"></script>
  <!--custom checkbox & radio-->
  <script type="text/javascript" src="${base}/js/ga.js"></script>

  <script type="text/javascript" src="${base}/assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="${base}/assets/bootstrap-daterangepicker/date.js"></script>
  <script type="text/javascript" src="${base}/assets/bootstrap-daterangepicker/daterangepicker.js"></script>
  <script type="text/javascript" src="${base}/assets/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>
  <script type="text/javascript" src="${base}/assets/ckeditor/ckeditor.js"></script>
  <script type="text/javascript" src="${base}/assets/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>
  <script src="${base}/js/respond.min.js" ></script>


  <!--common script for all pages-->
    <script src="${base}/js/common-scripts.js"></script>

  <!--script for this page-->
  <script src="${base}/js/form-component.js"></script>
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=b897193621422faef34cbe5f77145721&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
<script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
<script type="text/javascript">
   //默认显示重庆
    var currlong =106.531967;
    var currlat=29.574826;
    var pLongitude='${serverBase.location_ip?split(",")[0]}';
    var pLatitude='${serverBase.location_ip?split(",")[1]}';
    if(pLongitude!=''||$.trim(pLongitude).length!=0){
        currlong=pLongitude;
    }
    if(pLatitude!=''||$.trim(pLatitude).length!=0){
        currlat=pLatitude;
    }
    var marker,map = new AMap.Map('container_map', {
        zoom:15,
        center: [currlong,currlat],
        resizeEnable: true
    });
    //设置点标记
    marker = new AMap.Marker({ //添加自定义点标记
        map: map,
        position: [currlong,currlat], //基点位置
        icon: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3036571847,1126588206&fm=27&gp=0.jpg"
    });

    //输入提示
    var autoOptions = {
        input: "adress"
    };
    var auto = new AMap.Autocomplete(autoOptions);
    var placeSearch = new AMap.PlaceSearch({
        map: map
    });  //构造地点查询类
    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
    function select(e) {
        placeSearch.setCity(e.poi.adcode);
        placeSearch.search(e.poi.name);  //关键字查询查询
    }
    //注册插件
    AMap.service('AMap.Geocoder',function(){//回调函数
        //实例化Geocoder
        geocoder = new AMap.Geocoder({
            city: ""//城市，默认：“全国”
        });
        //TODO: 使用geocoder 对象完成相关功能
    })

    //点击事件
    map.on('click', function(e) {
        var lng=e.lnglat.getLng();
        var lat=e.lnglat.getLat();
        var lnglatXY=[lng,lat];//地图上所标点的坐标
        $("#location_ip").val(lng+","+lat);
        //根据经纬度获取地址信息
        geocoder.getAddress(lnglatXY, function(status, result) {
            if (status === 'complete' && result.info === 'OK') {
                //获得了有效的地址信息:
                //即，
                $("#adress").val();
                $("#adress").val(result.regeocode.formattedAddress);

            }else{
                alert("获取地址失败");
            }
        });
        if(marker){
            marker.setPosition([lng,lat]); //更新点标记位置
        }else{
            marker = new AMap.Marker({
                icon: "https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3036571847,1126588206&fm=27&gp=0.jpg",
                position: [lng,lat]
            });
            marker.setMap(map);
        }
    });
</script>
<script>
    $(function () {
    //绝对定位的div 可以通过drag() 拖动元素。（封装到$）
    $.fn.extend({
        drag: function(){
            this.on('mousedown',function(e){
                $(this).css('position','absolute');
                var disX = e.clientX - $(this).position().left,
                        disY = e.clientY - $(this).position().top,
                        $self = $(this);
                $(document).on('mousemove',function(e){
                    $self.css('left',e.clientX - disX);
                    $self.css('top',e.clientY - disY);
                })
                $(document).on('mouseup',function(){
                    $(document).off();
                })
            });
        }
    });
     });
</script>
  </body>
</html>
